<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="../../jquery-3.3.1.js"></script>
</head>
<body>
    <input type="text" name="" id="txt-title">
    <button id="btn-submit">添加</button>
    <button id="btn-del">删除</button>
    <div>
        <ul id="ul-list"></ul>
    </div>
    <script>
        window.onload=function(){
            var $txtTitle=$('#txt-title');
            var $btn=$("#btn-submit");
            var $del=$("#btn-del");
            var $ul=$('#ul-list');

            $btn.on('click',function(){
                var title=$txtTitle.val();
                if(!title){
                    console.log("请输入有效内容");
                    return;
                }
                var li=$("<li>"+title+"</li>");
                $ul.append(li);
                $txtTitle.val('')
            });

            $del.on('click',function(){
                document.getElementById('ul-list').removeChild(document.getElementById('ul-list').lastChild)
            })
        }
    </script>
</body>
</html>